<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>产品模块</title>
</head>
<style>
    * {
        margin: 0px;
        padding: 0px;
    }

    body {
        background-color: #f5f5f5;
        font-family: 'Microsoft YaHei';
    }
    .box {
        width: 298px;
        height: 415px;
        background-color:#fff;
        /* 让盒子居中 */
        margin: 100px auto;
    }

    .review {
        height: 70px;
        font-size: 14px;
        padding: 0 28px;
        margin-top: 30px;
    }

    .appraise {
        font-size: 12px;
        color: #b0b0b0;
        margin-top: 20px;
        padding: 0 28px;
    }

    .box img {
        width: 100%;
    }

    .box .info {
        font-size: 14px;
        margin-top: 15px;
        padding: 0 28px;
    }

    .info h4 {
        display: inline-block;
        font-weight: 400;
    }

    .info span {
        color: #ff6700;
    }

    .info em {
        font-style: normal;
        margin-left: 15px;
        margin-right: 6px;
    }
</style>
<body>
    <div class="box">
        <img class="img" src="images/img.jpg">
        <p class="review">
            快递牛，整体不错蓝牙可以说秒连，红米给力
        </p>
        <div class="appraise">
            来自1214219989的评价
        </div>
        <div class="info">
            <h4>Redmi Airdots真无线蓝...</h4>
            <em>|</em>    
            <span>99.9元</span>   
        </div>
    </div>
</body>
</html>